<template>
  <div class="app-container">
    <Find :searchImg="false" @Launchform="Launchform6" :formList="formList1" />

    <el-card style="margin-top: 15px" shadow="always" :body-style="{ padding: '20px' }">
      <el-button type="primary" size="default" @click="listAny">导出</el-button>

      <Table
        summary
        :summaryData="summaryData4"
        :isLoading="isLoading"
        :tableHeader="tableHeader"
        :tableData="InstructionCreationMehtodsTableDate"
        :TableHeight="97"
      />
      <PageModule :PageData="{ total, buttonS: true }" @pageSizeChange="handleSizeChange" @pageChange="handleCurrentChange" />
    </el-card>
  </div>
</template>
<script lang="ts">
import { defineComponent, ref, onMounted } from 'vue'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'DetalisAboutDelivery'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { TheShippingDetailsAreDisplayed, TheShippingDetailsAreDisplayedM } from '@/api/Control/WEB/DetalisAboutDelivery'
import fileRequest from '@/utils/fileRequest'
import { ElMessage } from 'element-plus'
const summaryData4 = ref<any[]>([
  {
    index: 4,
    num: 0
  }
])

//  出货明细查询
const TheShippingDetailsAreDisplayedMParms = ref({
  brand: '',
  collectTimeEnd: '',
  collectTimeStart: '',
  containerNo: '',
  deliveryDateEnd: '',
  deliveryDateStart: '',
  invoiceNo: '',
  lotNo: '',
  orderFile: '',
  orderType: '',
  vendorName: '',
  pageNum: 1,
  pageSize: 40
})

const listAny = async () => {
  const res = (await fileRequest.post(`/ProdOut/temp/export`, TheShippingDetailsAreDisplayedMParms.value)) as any
  const link = document.createElement('a') // 利用a标签自定义下载文件名
  let blob = new Blob([res.data]) // 创建Blob对象，设置文件类型
  link.style.display = 'none'
  //设置连接
  link.href = window.URL.createObjectURL(blob)
  // 获取当前日期
  const today = new Date()

  // 格式化日期为 YYYYMMDD
  const year = today.getFullYear() // 获取年份
  const month = String(today.getMonth() + 1).padStart(2, '0') // 获取月份（注意：月份从0开始，所以要加1）并补零
  const day = String(today.getDate()).padStart(2, '0') // 获取日期并补零

  // 生成文件名
  const FileName = `出货明细_${year}${month}${day}.xls`
  link.download = FileName //自定义文件名字
  document.body.appendChild(link)
  //模拟点击事件
  link.click()
  document.body.removeChild(link)
}

const Launchform6 = (row: any) => {
  TheShippingDetailsAreDisplayedMParms.value.vendorName = row[0].selectValue.split(' ')[0]
  TheShippingDetailsAreDisplayedMParms.value.lotNo = row[1].inputValue
  TheShippingDetailsAreDisplayedMParms.value.brand = row[2].selectValue

  TheShippingDetailsAreDisplayedMParms.value.invoiceNo = row[3].inputValue
  TheShippingDetailsAreDisplayedMParms.value.containerNo = row[4].inputValue
  TheShippingDetailsAreDisplayedMParms.value.collectTimeStart = row[5].dateValue[0]
  TheShippingDetailsAreDisplayedMParms.value.collectTimeEnd = row[5].dateValue[1]
  TheShippingDetailsAreDisplayedMParms.value.deliveryDateStart = row[6].dateValue[0]
  TheShippingDetailsAreDisplayedMParms.value.deliveryDateEnd = row[6].dateValue[1]
  TheShippingDetailsAreDisplayedMethods()
}

const InstructionCreationMehtodsTableDate = ref([])

const total = ref(0)

const handleSizeChange = (val: number) => {
  TheShippingDetailsAreDisplayedMParms.value.pageSize = val
  TheShippingDetailsAreDisplayedMethods()
}

const handleCurrentChange = (val: number) => {
  TheShippingDetailsAreDisplayedMParms.value.pageNum = val
  TheShippingDetailsAreDisplayedMethods()
}

const TheShippingDetailsAreDisplayedMethods = async () => {
  try {
    const result = await TheShippingDetailsAreDisplayedM(TheShippingDetailsAreDisplayedMParms.value)
    InstructionCreationMehtodsTableDate.value = result.list
    summaryData4.value[0].num = result.other.pairSum
    total.value = result.total
    console.log(InstructionCreationMehtodsTableDate.value)
  } catch (error) {
    JMessage.error('数据查询出错')
  }
}

// 厂商查询
const vendorQuery = async () => {
  isLoading.value = true
  try {
    const result = await TheShippingDetailsAreDisplayed()
    formList1.value[2].selectOptions = EvaluatesTheArrayReturnValue(result.brand)
    let NewArray = result.vendor.reduce((arr: any, item: any) => {
      if (item.VENDOR_NAME && item.VENDOR_NO) {
        // 只添加非空的 typeName 和 typeNo
        arr.push(item.VENDOR_NAME + ' ' + item.VENDOR_NO)
      }

      return arr
    }, [])
    formList1.value[0].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
    isLoading.value = false
  } catch (error) {
    JMessage.warning('厂商查询')
  }
}

onMounted(() => {
  vendorQuery()

  TheShippingDetailsAreDisplayedMethods()
})

const EvaluatesTheArrayReturnValue = (ArrayList: any) => {
  return ArrayList.map((item: any, index: any) => {
    return {
      optionKey: index,
      optionValue: item,
      optionLabel: item
    }
  })
}

const isLoading = ref(false)

const tableHeader = ref([
  {
    label: '类型',
    prop: 'collectType'
  },
  {
    label: '出库日期',
    prop: 'collectTime'
  },
  {
    label: '工厂编码',
    prop: 'vendorNo'
  },
  {
    label: '工厂',
    prop: 'vendorName'
  },
  {
    label: '双数',
    prop: 'pairQty'
  },

  {
    label: '货柜号',
    prop: 'containerNo'
  },
  {
    label: '指令号',
    prop: 'lotNo'
  },
  {
    label: '交期',
    prop: 'deliveryDate'
  },
  {
    label: '品牌',
    prop: 'brand'
  },

  {
    label: '发票号',
    prop: 'invoiceNo'
  },

  {
    label: '配码',
    prop: 'groupNo'
  },

  {
    label: 'PO',
    prop: 'poNo'
  },

  {
    label: '操作员',
    prop: 'sysUser'
  },

  {
    label: '操作时间',
    prop: 'sysDate'
  }
])

const formList1 = ref([
  {
    type: 'select',
    selectValue: '',
    selectP: '工厂',
    selectLabel: '',
    selectOptions: [
      {
        optionKey: '1',
        optionValue: '2',
        optionLabel: '所有'
      },
      {
        optionKey: '2',
        optionValue: '1',
        optionLabel: '已检核'
      },
      {
        optionKey: '3',
        optionValue: '3',
        optionLabel: '未检核'
      }
    ]
  },
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '品牌',
    selectLabel: '',
    selectOptions: [
      {
        optionKey: '1',
        optionValue: '2',
        optionLabel: '所有'
      },
      {
        optionKey: '2',
        optionValue: '1',
        optionLabel: '已检核'
      },
      {
        optionKey: '3',
        optionValue: '3',
        optionLabel: '未检核'
      }
    ]
  },
  {
    type: 'input',
    inputPlaceholder: '发票号',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '货柜号',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'date',
    dateLabel: '出货日期',
    dateValue: ''
  },
  {
    type: 'date',
    dateLabel: '交期',
    dateValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '搜索',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  }
])
</script>

<style lang="less" scoped></style>
